<template>
	<div>
		<div class="topTitle">评价管理</div>
		<div class="container">
			<div class="handle-box row-me row-center" style="margin-bottom: 0;">
				<el-form :model="query" label-width="80px" class="ipt row-me">
					<el-form-item label="机构名称">
						<el-input v-model="query.organName" placeholder="请输入机构名称"></el-input>
					</el-form-item>
					<el-form-item label="状态">
						<el-select v-model="query.status" placeholder="请选择">
							<el-option v-for="(item,index) in typeList" :key="index" :value="item.id" :label="item.name">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="评价日期" class="">
						<el-date-picker v-model="dateList" style="width: 380px;margin-right: 20px;" type="datetimerange"
							range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss"
							@change="onChange">
						</el-date-picker>
					</el-form-item>
				</el-form>
				<div class="margin-bottom20 margin-left20">
					<el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button>
					<el-button icon="el-icon-refresh-right" @click="handleRefresh">重置</el-button>
				</div>
			</div>
			<div class="margin-bottom20 margin-left20">
				<el-button type="primary" @click="parameterClick">评价参数</el-button>
				<el-button type="primary" @click="tagClick">评价标签</el-button>
				<el-button type="primary" @click="remarkClick">二级评论管理</el-button>
			</div>
			<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header"
				@selection-change="handleSelectionChange" :row-key="getRowKeys" :expand-row-keys="expands" border lazy
				:load="load" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" @expand-change="oneClick">
				<el-table-column type="expand">
					<template slot-scope="props">
						<!-- 测试 -->
						<div class="padding-left20 padding-right20 row-me row-center" v-if="!$.isEmpty(props.row.images)">
							<div class="row-me row-center">评价图片：</div>
							<el-image class="width40 height40 margin-right10" :src="item" :preview-src-list="[item]"
								v-for="(item,index) in props.row.images.split(',')" :key="index"></el-image>
						</div>
						<div class="padding-left20 padding-right20 row-me row-center" v-if="!$.isEmpty(props.row.voucher)">
							<div class="row-me row-center">凭证图片：</div>
							<el-image class="width40 height40 margin-right10" :src="item" :preview-src-list="[item]"
								v-for="(item,index) in props.row.voucher.split(',')" :key="index"></el-image>
						</div>
						<div class="padding-left20 padding-right20 margin-top20">
							<div class="row-me row-center">回复评价：</div>
							<el-table :data="props.row.twoComments" style="width: 100%">
								<el-table-column label="头像/昵称">
									<template slot-scope="scope">
										<div class="row-me center-all">
											<el-image class="width40 height40" :src="scope.row.userIcon"
												:preview-src-list="[scope.row.userIcon]"></el-image>
											<span>/{{scope.row.userName}}/{{scope.row.userId}}</span>
										</div>
									</template>
								</el-table-column>
								<el-table-column label="评价商家">
									<template slot-scope="scope">
										<p v-html='scope.row.organName'></p>
									</template>
								</el-table-column>
								<el-table-column label="内容">
									<template slot-scope="scope">
										<div class="" v-if="!$.isEmpty(scope.row.content) && scope.row.randType == 1">
											<div class="margin-bottom5" v-for="(item,index) in JSON.parse(scope.row.content)" :key="index">
												{{item.name}}:{{item.content}}
											</div>
										</div>
										<div class="" v-else>
											{{scope.row.content}}
										</div>
									</template>
								</el-table-column>
								<el-table-column label="评价时间">
									<template slot-scope="scope">
										<p v-html='scope.row.createTime'></p>
									</template>
								</el-table-column>
								<el-table-column label="点赞数">
									<template slot-scope="scope">
										<p v-html='scope.row.thumbUp'></p>
									</template>
								</el-table-column>
								<el-table-column label="状态" align="center">
									<template slot-scope="scope">{{scope.row.status | formatStatus}}</template>
								</el-table-column>
								<el-table-column label="操作" width="200px" align="center">
									<template slot-scope="scope">
										<el-button v-if="scope.row.status =='0'" type="text" class="red"
											@click="handleStatus(scope.$index, scope.row)">审核</el-button>
									</template>
								</el-table-column>

							</el-table>
						</div>
					</template>
				</el-table-column>

				<el-table-column label="用户头像/昵称/ID" align="center" width="300">
					<template slot-scope="scope">
						<div class="row-me center-all">
							<el-image class="width40 height40" :src="scope.row.userIcon"
								:preview-src-list="[scope.row.userIcon]"></el-image>
							<span>/{{scope.row.userName}}/{{scope.row.userId}}</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="organName" label="评价商家"></el-table-column>
				<el-table-column prop="content" label="评论内容" show-overflow-tooltip>
					<template slot-scope="scope">
						<div class="" v-if="!$.isEmpty(scope.row.content) && scope.row.randType == 1">
							<div class="margin-bottom5" v-for="(item,index) in JSON.parse(scope.row.content)" :key="index">
								{{item.name}}:{{item.content}}
							</div>
						</div>
						<div class="" v-else>
							{{scope.row.content}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="" label="是否上传证明">
					<template slot-scope="scope">
						<div class="" v-if="!$.isEmpty(scope.row.voucher)">是</div>
						<div class="" v-else>否</div>
					</template>
				</el-table-column>
				<el-table-column prop="score" label="评分"></el-table-column>
				<el-table-column prop="createTime" label="评价时间"></el-table-column>
				<el-table-column prop="thumbUp" label="点赞数" width="70"></el-table-column>
				<el-table-column label="状态" align="center">
					<template slot-scope="scope">{{scope.row.status | formatStatus}}</template>
				</el-table-column>
				<!-- <el-table-column prop="recommend" width="100" label="是否回复" align="center">
					<template slot-scope="scope">
						<span class="blue-text" v-if="scope.row.replay" @click="clickReply(scope.row)">已回复</span>
						<span v-else>未回复</span>
					</template>
				</el-table-column> -->
				<el-table-column label="操作" align="center">
					<template slot-scope="scope">
						<el-button v-if="scope.row.status =='0'" type="text" class="red"
							@click="handleStatus(scope.$index, scope.row)">审核</el-button>
						<el-button type="text" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
						<el-popconfirm title="确定删除？" @confirm="classesDelClick(scope.row.id)">
							<el-button type="text" slot="reference">删除</el-button>
						</el-popconfirm>

						<el-dropdown>
							<span class="el-dropdown-link">
								更多<i class="el-icon-arrow-down el-icon--right"></i>
							</span>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item @click.native="reply(scope.row)">
									<el-button type="text">回复</el-button>
								</el-dropdown-item>
								<el-dropdown-item
									v-if="($.isEmpty(scope.row.recommend) || scope.row.recommend == false)&&scope.row.status=='1'"
									@click.native="handleConfirm(scope.$index, scope.row)">
									<el-button type="text">设置精选
									</el-button>
								</el-dropdown-item>
								<el-dropdown-item v-if="scope.row.recommend == true"
									@click.native="handleReject(scope.$index, scope.row)">
									<el-button type="text">取消精选
									</el-button>
								</el-dropdown-item>
								<el-dropdown-item @click.native="handlePageUserComment(scope.$index, scope.row)">
									<el-button type="text">
										用户所有评论</el-button>
								</el-dropdown-item>
								<el-dropdown-item @click.native="voucherClick(scope.$index, scope.row)"
									v-if="!$.isEmpty(scope.row.voucher)">
									<el-button type="text">
										查看凭证</el-button>
								</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
					</template>
				</el-table-column>
			</el-table>
			<div class="pagination">
				<el-pagination background layout="total,sizes, prev, pager, next" :page-sizes="[20, 30, 40, 50]"
					@size-change="handleSizeChange" :current-page="query.pogeNo" :total="pageTotal"
					@current-change="handlePageChange"></el-pagination>
			</div>
		</div>

		<!-- 回复评论 -->
		<el-dialog title="已回复评论" :visible.sync="replyVisible" width="40%">
			<div class="row-me margin-bottom20">
				<el-button :type="type==1?'primary':'default'" @click="getCommentReply(1)">管理员回复</el-button>
				<el-button :type="type==2?'primary':'default'" @click="getCommentReply(2)">用户回复</el-button>
			</div>
			<el-form ref="form" :model="replyForm" label-width="80px">
				<el-form-item label="评论内容:">
					<div>{{replyForm.content}}</div>
				</el-form-item>
				<el-form-item label="评论时间:">
					<div>{{replyForm.createTime}}</div>
				</el-form-item>
			</el-form>
			<el-table :data="commentReplyData" border>
				<el-table-column label="管理员回复" prop="content" align="center"></el-table-column>
				<el-table-column label="回复时间" prop="createTime" align="center"></el-table-column>
			</el-table>
			<span slot="footer" class="dialog-footer">
				<el-button @click="replyVisible = false" type="primary" v-if="!isReplay">关 闭</el-button>
				<el-button @click="replyVisible = false" type="primary" v-else>确 认</el-button>
			</span>
		</el-dialog>

		<!-- 编辑弹出框 -->
		<el-dialog title="编辑" :visible.sync="editVisible" v-if="editVisible" width="40%">
			<el-form ref="form" :model="form" label-width="120px">

				<div class="" v-for="(item,index) in form.content" :key="index">
					<el-form-item :label="item.name">
						<el-input type="textarea" v-model="item.content" placeholder="请输入(必填项)"></el-input>
					</el-form-item>
				</div>

			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="editVisible = false">取 消</el-button>
				<el-button type="primary" @click="saveEdit">确 定</el-button>
			</span>
		</el-dialog>
		<!-- 回复弹框 -->
		<el-dialog title="回复内容" :visible.sync="dialogVisibleReply" v-if="dialogVisibleReply" width="30%">
			<el-input type="textarea" :rows="4" placeholder="请输入回复内容" v-model="comment.content">
			</el-input>
			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisibleReply = false">取 消</el-button>
				<el-button type="primary" @click="commentSave">确 定</el-button>
			</span>
		</el-dialog>
		<!-- 查看凭证出框 -->
		<el-dialog title="查看凭证" :visible.sync="voucherShow" v-if="voucherShow" width="40%">
			<div class="padding-bottom10" style="overflow: hidden;">
				<div class="margin-right10" style="width: 100px; height: 100px;float:left"
					v-for="(item,index) in voucherForm.url" :key="index">
					<el-image style="width: 100px; height: 100px;" :src="item" :preview-src-list="voucherForm.url">
					</el-image>
				</div>
			</div>
		</el-dialog>
		<el-dialog title="用户所有评论" :visible.sync="dialogVisibleComment" v-if="dialogVisibleComment" width="70%">
			<div class="handle-box">
				<el-input v-model="query2.key" placeholder="请输入用户昵称、ID、评论内容" class="width300 mr20"></el-input>
				<el-button type="primary" icon="el-icon-search" @click="handleSearch2">搜索</el-button>
				<el-button icon="el-icon-refresh-right" @click="handleRefresh2">重置</el-button>
				<!-- <el-button type="primary" icon="el-icon-delete" @click="delAllSelection">批量删除</el-button> -->
			</div>
			<el-table :data="tableData2" border class="table" ref="multipleTable" header-cell-class-name="table-header"
				@selection-change="handleSelectionChange">
				<el-table-column type="expand">
					<template slot-scope="props">
						<div class="padding-left20 padding-right20 row-me row-center">
							<div class="row-me row-center">评价图片：</div>
							<el-image class="width40 height40" :src="item" :preview-src-list="[item]"
								v-for="(item,index) in props.row.target.url" :key="index"></el-image>
						</div>
						<div class="padding-left20 padding-right20 row-me row-center">
							<div class="row-me row-center">凭证图片：</div>
							<el-image class="width40 height40" :src="item" :preview-src-list="[item]"
								v-for="(item,index) in props.row.target.url" :key="index"></el-image>
						</div>
						<div class="padding-left20 padding-right20 margin-top20">
							<div class="row-me row-center">回复评价：</div>
							<el-table :data="props.row.target.optionList" style="width: 100%">
								<el-table-column label="头像/昵称">
									<template slot-scope="scope">
										<div class="row-me row-center">{{scope.row.content}}</div>
									</template>
								</el-table-column>
								<el-table-column label="评价商家">
									<template slot-scope="scope">
										<p v-html='scope.row.content'></p>
									</template>
								</el-table-column>
								<el-table-column label="内容">
									<template slot-scope="scope">
										<p v-html='scope.row.content'></p>
									</template>
								</el-table-column>
								<el-table-column label="评价时间">
									<template slot-scope="scope">
										<p v-html='scope.row.createTime'></p>
									</template>
								</el-table-column>
								<el-table-column label="点赞数">
									<template slot-scope="scope">
										<p v-html='scope.row.thumbUp'></p>
									</template>
								</el-table-column>
								<el-table-column label="状态" align="center">
									<template slot-scope="scope">{{scope.row.status | formatStatus}}</template>
								</el-table-column>
							</el-table>
						</div>
					</template>
				</el-table-column>
				<!-- <el-table-column type="selection" width="55" align="center"></el-table-column> -->
				<!-- <el-table-column label="用户ID" width="80" prop="userId"></el-table-column> -->
				<el-table-column label="用户头像/昵称/ID" align="center">
					<template slot-scope="scope">
						<div class="row-me center-all">
							<el-image class="width40 height40" :src="scope.row.userIcon"
								:preview-src-list="[scope.row.userIcon]"></el-image>
							<span>/{{scope.row.userName}}</span>
							<span>/{{scope.row.userId}}</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="organName" label="评价商家"></el-table-column>
				<el-table-column prop="content" label="评论内容" show-overflow-tooltip>
					<template slot-scope="scope">
						<div class="" v-if="!$.isEmpty(scope.row.content)">
							<div class="margin-bottom5" v-for="(item,index) in JSON.parse(scope.row.content)" :key="index">
								{{item.name}}:{{item.content}}
							</div>
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="" label="是否上传证明">
					<template slot-scope="scope">
						<div class="" v-if="!$.isEmpty(scope.row.voucher)">是</div>
						<div class="" v-else>否</div>
					</template>
				</el-table-column>
				<el-table-column prop="score" label="评分"></el-table-column>
				<el-table-column prop="createTime" label="评价时间" width="150"></el-table-column>
				<el-table-column prop="thumbUp" label="点赞数" width="70"></el-table-column>
				<el-table-column label="状态" align="center">
					<template slot-scope="scope">{{scope.row.status | formatStatus}}</template>
				</el-table-column>
				<!-- <el-table-column prop="recommend" width="100" label="是否回复" align="center">
					<template slot-scope="scope">
						<span class="blue-text" v-if="scope.row.replay" @click="clickReply(scope.row)">已回复</span>
						<span v-else>未回复</span>
					</template>
				</el-table-column> -->
				<el-table-column label="操作00" width="200px" align="center">
					<template slot-scope="scope">
						<el-button v-if="scope.row.status == 0" type="text" class="red"
							@click="handleStatus(scope.$index, scope.row)">审核</el-button>
						<el-button type="text" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
						<el-popconfirm title="确定删除？" @confirm="classesDelClick(scope.row.id)">
							<el-button type="text" slot="reference">删除</el-button>
						</el-popconfirm>
						<el-dropdown>
							<span class="el-dropdown-link">
								更多<i class="el-icon-arrow-down el-icon--right"></i>
							</span>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item @click.native="reply(scope.row)">
									<el-button type="text">回复</el-button>
								</el-dropdown-item>
								<el-dropdown-item
									v-if="($.isEmpty(scope.row.recommend) || scope.row.recommend == false)&&scope.row.status=='1'"
									@click.native="handleConfirm(scope.$index, scope.row)">
									<el-button type="text">设置精选
									</el-button>
								</el-dropdown-item>
								<el-dropdown-item v-if="scope.row.recommend == true"
									@click.native="handleReject(scope.$index, scope.row)">
									<el-button type="text">取消精选
									</el-button>
								</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
					</template>
				</el-table-column>
			</el-table>
			<div class="pagination">
				<el-pagination background layout="total,sizes, prev, pager, next" :page-sizes="[20, 30, 40, 50]"
					@size-change="handleSizeChange2" :current-page="query2.pogeNo" :total="pageTotal2"
					@current-change="handlePageChange2"></el-pagination>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisibleComment = false" type="primary">关 闭</el-button>
			</span>
		</el-dialog>

		<!-- 评论审核配置auditShow -->
		<el-dialog title="评论审核配置" :visible.sync="auditShow" v-if="auditShow" width="40%">
			<el-form :model="auditForm" :rules="rules1" ref="auditForm" label-width="120px">
				<el-form-item label="" prop="deploy">
					<el-radio-group v-model="auditForm.deploy" @change="$forceUpdate()">
						<el-radio label="0">关闭评论</el-radio>
						<el-radio label="1">系统审核</el-radio>
						<el-radio label="2">api审核</el-radio>
						<el-radio label="3">人工审核</el-radio>
						<el-radio label="4">禁止评论</el-radio>
					</el-radio-group>
				</el-form-item>

				<el-form-item>
					<el-button type="primary" @click="auditConfirm('auditForm')">确定</el-button>
					<!-- <el-button @click="auditShow = false">取消</el-button> -->
				</el-form-item>
			</el-form>
		</el-dialog>

		<!-- 评价标签 -->
		<el-dialog title="评价标签" :visible.sync="feedbackShow" v-if="feedbackShow" width="40%">
			<el-table :data="feedbackList" border>
				<el-table-column label="标签名称" align="center">
					<template slot-scope="{row}">
						<el-input v-model="row.name" v-if="row.isEdit"></el-input>
						<span v-else>{{row.name}}</span>
					</template>
				</el-table-column>
				<el-table-column label="操作" align="center" width="200">
					<template slot-scope="scope">
						<el-button type="text" v-if="scope.row.isEdit" @click="handleTagAdd(scope.row)">保存</el-button>
						<el-button type="text" @click="scope.row.isEdit=true" v-else>编辑</el-button>
						<el-popconfirm title="确认删除？" @confirm="handleTagDel(scope.row.id)">
							<el-button slot="reference" type="text">删除</el-button>
						</el-popconfirm>
					</template>
				</el-table-column>
			</el-table>
			<div class="margin-top10">
				<el-pagination background layout="->,total,sizes, prev, pager, next" :current-page="tagQuery.pogeNo"
					:page-sizes="[10, 20, 30, 40]" @size-change="handleSizeTagChange" :page-size="tagQuery.pageSize"
					:total="pageTagTotal" @current-change="handlePageTagChange"></el-pagination>
			</div>
			<div class="margin-top20 row-me center-all">
				<el-input v-model="tagQuery.name" placeholder="请输入名称" class="margin-right20 width300"></el-input>
				<el-button type="primary" @click="handleTagAdd">新增</el-button>
			</div>
			<span slot="footer">
				<el-button type="primary" @click="tagVisible = false">关 闭</el-button>
			</span>
		</el-dialog>

		<!-- 审核弹层 -->
		<el-dialog title="审核" :visible.sync="checkShow" v-if="checkShow" width="40%">
			<el-form :model="checkForm" :rules="rules1" ref="checkForm" label-width="120px" class="demo-addClassesForm">
				<el-form-item label="审核" prop="check">
					<el-radio-group v-model="checkForm.check">
						<el-radio label="0">通过</el-radio>
						<el-radio label="1">驳回</el-radio>
					</el-radio-group>
				</el-form-item>

				<el-form-item>
					<el-button type="primary" @click="checkConfirm('checkForm')">确定</el-button>
					<el-button @click="checkShow = false">取消</el-button>
				</el-form-item>
			</el-form>
		</el-dialog>

		<!-- 二级评论弹框 -->
		<el-dialog title="二级评论管理" :visible.sync="remarkShow" v-if="remarkShow" width="70%">
			<el-table :data="remarkList" border class="table">
				<el-table-column label="用户头像/昵称/ID" align="center">
					<template slot-scope="scope">
						<div class="row-me center-all">
							<el-image class="width40 height40" :src="scope.row.userIcon"
								:preview-src-list="[scope.row.userIcon]"></el-image>
							<span>/{{scope.row.userName}}/{{scope.row.userId}}</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="organName" label="评价商家"></el-table-column>
				<el-table-column prop="content" label="评论内容" show-overflow-tooltip>
					<template slot-scope="scope">
						<div class="" v-if="!$.isEmpty(scope.row.content) && scope.row.randType == 1">
							<div class="margin-bottom5" v-for="(item,index) in JSON.parse(scope.row.content)" :key="index">
								{{item.name}}:{{item.content}}
							</div>
						</div>
						<div class="" v-else>
							{{scope.row.content}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="createTime" label="评价时间" align="center"></el-table-column>
				<el-table-column prop="thumbUp" label="点赞数" align="center"></el-table-column>
				<el-table-column prop="score" label="上级评价" align="center">
					<template slot-scope="scope">
						<span style="color: #66b1ff;cursor: pointer;" @click="lookClick(scope.$index, scope.row)">查看</span>
					</template>
				</el-table-column>
				<el-table-column label="状态" align="center">
					<template slot-scope="scope">{{scope.row.status | formatStatus}}</template>
				</el-table-column>
				<el-table-column label="操作" align="center">
					<template slot-scope="scope">
						<el-button v-if="scope.row.status =='0'" type="text" class="red"
							@click="handleStatus(scope.$index, scope.row)">审核</el-button>
						<el-button type="text" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
						<el-popconfirm title="确定删除？" @confirm="classesDelClick(scope.row.id)">
							<el-button type="text" slot="reference">删除</el-button>
						</el-popconfirm>
					</template>
				</el-table-column>
			</el-table>
		</el-dialog>
		<!-- 上级评价 -->
		<el-dialog title="上级评价" :visible.sync="appraiseShow" v-if="appraiseShow" width="40%">
			<el-form :model="checkForm" :rules="rules1" ref="checkForm" label-width="120px" class="demo-addClassesForm">
				<el-form-item label="评价用户昵称" prop="check">
					<div class="font-size16">
						<span>{{appraiseForm.organName}}</span>
					</div>
				</el-form-item>


				<el-form-item label="评价时间" prop="check">
					<div class="font-size16">
						<span>{{appraiseForm.createTime}}</span>
					</div>
				</el-form-item>
				<el-form-item label="评价内容" prop="check">
					<div class="font-size16 row-me row-center">
						<div class="" v-if="!$.isEmpty(appraiseForm.content)">
							<div class="margin-bottom5" v-for="(item,index) in JSON.parse(appraiseForm.content)" :key="index">
								{{item.name}}:{{item.content}}
							</div>
						</div>
					</div>
				</el-form-item>
			</el-form>



		</el-dialog>
	</div>
</template>

<script>
	import {
		getCommentReply,
		comment
	} from "@/api/user"
	export default {
		name: 'comment',
		data() {
			return {
				appraiseShow: false,
				appraiseForm: {},
				remarkShow: false,
				remarkList: [],
				// 审核
				checkShow: false,
				checkForm: {
					check: '0',
				},
				rules1: {
					check: [{
						required: true,
						message: '请选择',
						trigger: 'change'
					}],
				},

				dateList: [],
				typeList: [{
						name: '待审核',
						id: 0,
					},
					{
						name: '审核通过',
						id: 1,
					},
					{
						name: '审核驳回',
						id: 2,
					},
				],
				query: {
					randType: 1, //
					pageNumber: 1,
					pageSize: 20
				},
				query2: {
					pogeNo: 1,
					pageSize: 20
				},
				optionNoArr: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L'], //选择题题号数组
				userVisible: true,
				replyVisible: false,
				replyTitle: '已回复评论',
				tableData: [],
				expands: [],
				getRowKeys(row) {
					return row.id
				},
				multipleSelection: [],
				delList: [],
				editVisible: false,
				pageTotal: 0,
				form: {},
				idx: -1,
				id: -1,
				Authorization: {
					'Authorization': localStorage.getItem('htk_token')
				},
				token: localStorage.getItem('htk_token'),
				topicInfoForm: {},
				replyForm: {},
				batchOperation: '',
				isReplay: false,
				comment: {},
				dialogVisibleReply: false,
				type: 1,
				commentReplyData: [],
				tableData2: [],
				pageTotal2: 0,
				dialogVisibleComment: false,
				// 评论审核配置
				auditShow: false,
				auditForm: {
					deploy: '0'
				},
				rules1: {
					deploy: [{
						required: true,
						message: '请选择配置',
						trigger: 'change'
					}],
				},
				// 评价标签
				feedbackShow: false,
				feedbackList: [],
				tagQuery: {
					pogeNo: 1,
					pageSize: 10
				},
				pageTagTotal: 0,
				voucherForm: {},
				voucherShow: false,
			};
		},
		created() {
			this.getData();
			this.getTagData();

		},
		filters: {
			formatStatus(cellValue) {
				console.log(cellValue)
				if (cellValue == '0') {
					return '待审核'
				} else if (cellValue == '1') {
					return '已通过'
				} else if (cellValue == '2') {
					return '审核驳回'
				}
			}
		},
		methods: {
			load(tree, treeNode, resolve) {
				setTimeout(() => {
					resolve([{
						id: 31,
						date: '2016-05-01',
						name: '王小虎',
						address: '上海市普陀区金沙江路 1519 弄'
					}, {
						id: 32,
						date: '2016-05-01',
						name: '王小虎',
						address: '上海市普陀区金沙江路 1519 弄'
					}])
				}, 1000)
			},
			// 点击审核确定
			checkConfirm(checkForm) {
				this.$refs[checkForm].validate((valid) => {
					if (valid) {
						this.checkForm = false;
					} else {
						return false;
					}
				});
			},

			// 评价标签
			async getTagData() {
				const res = await this.$get('/admin/messages/pageComments', this.tagQuery)
				if (res.code == 1000) {
					this.feedbackList = res.data.list
					this.pageTagTotal = res.data.totalRow
					for (let item of this.feedbackList) {
						this.$set(item, 'isEdit', false)
					}
				}
			},
			// 标签分类分页
			handlePageTagChange(val) {
				this.tagQuery.pogeNo = val
				this.getTagData();
			},
			handleSizeTagChange(val) {
				this.tagQuery.pageSize = val
				this.getTagData();
			},
			// 新增编辑反馈类型
			handleTagAdd(row) {
				if (row.id) {
					this.$post('/admin/messages/CommentLabelUpdate', {
						id: row.id,
						name: row.name
					}).then(res => {
						if (res.code == 1000) {
							this.$message.success('编辑成功')
							this.getTagData()
							row.isEdit = false
						}
					})
				} else {
					if (this.$.isEmpty(this.tagQuery.name)) {
						this.$message.error('新增内容不能为空')
						return
					}
					this.$post('/admin/messages/CommentLabelSave', {
						name: this.tagQuery.name
					}).then(res => {
						if (res.code == 1000) {
							this.$message.success('新增成功')
							this.tagQuery.name = ''
							this.getTagData()
						}
					})
				}
			},
			//删除标签分类
			async handleTagDel(id) {
				const res = await this.$postForm('/admin/messages/CommentLabelDelete', {
					id
				})
				if (res.code == 1000) {
					this.$message.success('删除成功')
					this.getTagData()
				}
			},
			// 点击评价参数
			parameterClick() {
				this.getByKeyWay();
				this.auditShow = true;
			},
			// 点击评价标签
			tagClick() {
				this.feedbackShow = true;
			},
			// 点击二级评论管理
			remarkClick() {
				this.remarkShow = true;
				// this.remarkList = 
				var dataObj = {
					randType: 2, //
					pageNumber: 1,
					pageSize: 90000,
				}
				this.$postForm('/admin/messages/organCommentAll', dataObj).then((res) => {
					if (res.code == 1000) {
						this.$forceUpdate(); //强制刷新
						this.remarkList = res.data.list;
					}
				}).catch((error) => {
					console.log(error)
				})
			},
			// 评论审核配置保存
			auditConfirm(auditForm) {
				this.$refs[auditForm].validate((valid) => {
					if (valid) {
						this.$post('/admin/config/update', {
							value: this.auditForm.deploy,
							id: this.auditForm.id,
							category: this.auditForm.category,
							description: this.auditForm.description
						}).then((res) => {
							if (res.code == 1000) {
								this.$message.success('操作成功')
								this.auditShow = false;
							}
						}).catch((error) => {
							console.log(error)
						})

					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			// 选择日期
			onChange(e) {
				if (e.length != 0) {
					this.query.startTime = e[0]
					this.query.endTime = e[1]
				} else {
					this.query.startTime = ''
					this.query.endTime = ''
				}
			},
			commentSave() {
				if (this.$.isEmpty(this.comment.content)) {
					this.$message.warning('请输入回复内容!')
					return
				}

				this.$post('/admin/messages/organCommentUpdate', {
					id: this.comment.commentId,
					storeComment: this.comment.content,
				}).then((res) => {
					if (res.code == 1000) {
						this.comment = {}
						this.getData();
						this.$message.success('回复成功');
						this.dialogVisibleReply = false
					}
				}).catch((error) => {
					console.log(error)
				})
			},
			// 回复
			reply(row) {
				this.dialogVisibleReply = true
				this.comment.commentId = row.id
			},
			clickReply(row) {
				this.replyForm = row
				this.getCommentReply()
				this.replyVisible = true
			},
			async getCommentReply(type = 1) {
				this.type = type
				const res = await getCommentReply({
					commentId: this.replyForm.id,
					type: this.type
				})
				this.commentReplyData = res.data.data
			},
			// 编辑操作
			handleEdit(index, row) {
				this.form = {};
				this.form = JSON.parse(JSON.stringify(row)) // 深拷贝
				console.log(this.form, '00000')
				this.form.content = JSON.parse(this.form.content)
				console.log(this.form, '11111')
				this.editVisible = true;
			},
			// 查看凭证
			voucherClick(index, row) {
				this.voucherShow = true;
				this.voucherForm.url = row.voucher.split(",");
			},
			handleSizeChange(val) {
				this.$set(this.query, 'pageSize', val);
				this.getData();
			},
			handleSizeChange2(val) {
				this.$set(this.query2, 'pageSize', val);
				this.getData2();
			},
			getData() {
				this.query.randType = 1;
				this.$postForm('/admin/messages/organCommentAll', this.query).then((res) => {
					if (res.code == 1000) {
						this.$forceUpdate(); //强制刷新
						this.tableData = res.data.list
						this.pageTotal = res.data.totalRow
					}
				}).catch((error) => {
					console.log(error)
				})
			},

			getByKeyWay() {
				this.$get('/admin/config/getByKey', {
					key: 'comment_update',
				}).then((res) => {
					if (res.code == 1000) {
						this.auditForm = res.data;
						this.auditForm.deploy = res.data.value;
					}
				}).catch((error) => {
					console.log(error)
				})
			},

			// 触发搜索按钮
			handleSearch() {
				this.$set(this.query, 'pogeNo', 1);
				this.getData();
			},
			handleRefresh() {
				this.query = {
					pogeNo: 1,
					pageSize: 20
				}
				this.dateList = [];
				this.handleSearch()
			},
			handleSearch2() {
				this.$set(this.query2, 'pogeNo', 1);
				// this.query2.randType = 1;
				this.getData2();
			},
			handleRefresh2() {
				this.query2 = {
					pogeNo: 1,
					pageSize: 20,
					userId: this.query2.userId,
				}
				this.handleSearch2()
			},
			// 点击查看上级
			lookClick(index, row) {
				this.$postForm('/admin/messages/organCommentShang', {
					commentId: row.commentId
				}).then((res) => {
					if (res.code == 1000) {
						this.appraiseForm = res.data;
						this.appraiseShow = true;
					}
				}).catch((error) => {
					console.log(error)
				})
			},
			// 确定审核
			handleStatus(index, row) {
				// 状态 0未审核 1已审核 2审核失败
				this.$confirm('是否要审核通过?', '提示', {
					confirmButtonText: '通过',
					cancelButtonText: '拒绝',
					type: 'warning'
				}).then(() => {
					this.$post('/admin/messages/organCommentUpdate', {
						id: row.id,
						status: 1
					}).then((res) => {
						if (res.code == 1000) {
							if (this.dialogVisibleComment == true) {
								this.getData2();
							} else if (this.remarkShow == true) {
								this.remarkClick()
							} else {
								this.getData();
							}
							this.$message.success('审核成功');
						}
					}).catch((error) => {
						console.log(error)
					})
				}).catch(() => {
					this.$post('/admin/messages/organCommentUpdate', {
						id: row.id,
						status: 2
					}).then((res) => {
						if (res.code == 1000) {
							if (this.dialogVisibleComment == true) {
								this.getData2();
							} else if (this.remarkShow == true) {
								this.remarkClick()
							} else {
								this.getData();
							}
							this.$message.success('审核拒绝');
						}
					}).catch((error) => {
						console.log(error)
					})
				});

			},
			// 删除操作
			classesDelClick(id) {

				this.$postForm('/admin/messages/organCommentDelete', {
					id: id
				}).then((res) => {
					if (res.code == 1000) {
						if (this.dialogVisibleComment == true) {
							this.getData2();
						} else if (this.remarkShow == true) {
							this.remarkClick()
						} else {
							this.getData();
						}
						this.$message.success('删除成功');
					}
				}).catch((error) => {
					console.log(error)
				})
			},
			// 推荐操作
			handleConfirm(index, row) {
				this.$confirm('确定要设置为精选吗？', '提示', {
					type: 'warning'
				}).then(() => {
					this.$post('/admin/messages/organCommentUpdate', {
						id: row.id,
						recommend: true,
					}).then((res) => {
						if (res.code == 1000) {
							if (this.dialogVisibleComment == true) {
								this.getData2();
							} else if (this.remarkShow == true) {
								this.remarkClick()
							} else {
								this.getData();
							}
							this.$message.success('操作成功');
						}
					}).catch((error) => {
						console.log(error)
					})

				}).catch(() => {});
			},
			// 取消推荐操作
			handleReject(index, row) {
				this.$confirm('确定要设置为精选吗？', '提示', {
					type: 'warning'
				}).then(() => {
					this.$post('/admin/messages/organCommentUpdate', {
						id: row.id,
						recommend: false,
					}).then((res) => {
						if (res.code == 1000) {
							if (this.dialogVisibleComment == true) {
								this.getData2();
							} else if (this.remarkShow == true) {
								this.remarkClick()
							} else {
								this.getData();
							}
							this.$message.success('操作成功');
						}
					}).catch((error) => {
						console.log(error)
					})

				}).catch(() => {});
			},
			// 多选操作
			handleSelectionChange(val) {
				this.multipleSelection = val;
			},
			// 点击表格获取下级数据--只展示当前一个折版
			oneClick(row, expandedRows) {
				// 5555555555555555
				// 列表展开
				let that = this
				//只展开一行
				if (expandedRows.length) { //说明展开了
					this.expands = []
					if (row) {
						this.expands.push(row.id) //只展开当前行id，唯一标识
						// console.log(row, '1111')
						// var dataObj = {
						// 	id: row.id,
						// 	randType: 2, //
						// 	pageNumber: 1,
						// 	pageSize: 2,
						// 	userId: row.userId,
						// 	organId: row.organId,
						// }
						// this.$postForm('/admin/messages/organCommentAll', dataObj).then((res) => {
						// 	if (res.code == 1000) {
						// 		this.$forceUpdate(); //强制刷新
						// 		row.aaa = [];
						// 		row.aaa = res.data.list;
						// 		console.log(row, 'rowrow')
						// 	}
						// }).catch((error) => {
						// 	console.log(error)
						// })

					}
				} else { //说明收起了
					this.expands = []
				}

			},

			delAllSelection() {
				const length = this.multipleSelection.length;
				let str = '';
				this.delList = this.delList.concat(this.multipleSelection);
				for (let i = 0; i < length; i++) {
					str += this.multipleSelection[i].id + ',';
				}
				this.$confirm('确定要删除吗？', '提示', {
					type: 'warning'
				}).then(() => {
					let vm = this;
					this.$http.get(this.$host + '/admin/user/deleteComments?ids=' + str + "&type=" + this.query
						.type, {
							headers: {
								'Authorization': this.token,
								'Content-Type': 'application/x-www-form-urlencoded'
							}
						}).then(function(response) {
						if (response.data.code != 1000) {
							vm.$message.error('服务异常');
							return;
						}
						vm.$message.success('删除成功');
						vm.getData();
					});

				}).catch(() => {});
			},
			// 编辑操作
			handlePageUserComment(index, row) {
				this.query2.userId = row.userId;
				this.dialogVisibleComment = true
				this.getData2()

			},
			getData2() {
				// this.query2.randType = 1;
				this.$postForm('/admin/messages/organCommentAll', this.query2).then((res) => {
					if (res.code == 1000) {
						this.$forceUpdate(); //强制刷新
						this.tableData2 = res.data.list
						this.pageTotal2 = res.data.totalRow
					}
				}).catch((error) => {
					console.log(error)
				})
			},
			// 保存编辑
			saveEdit() {
				// console.log(this.form, 'this.form')
				// return

				for (var i = 0; i < this.form.content.length; i++) {
					var obj = this.form.content[i];

					if (obj.content === null || obj.content === undefined) {
						// console.log('Age is empty for object:', obj);
						this.$message.error('评论内容不能为空');
						return
					}
				}


				this.$post('/admin/messages/organCommentUpdate', {
					id: this.form.id,
					content: JSON.stringify(this.form.content),
				}).then((res) => {
					if (res.code == 1000) {
						this.$message.success('提交成功');
						this.editVisible = false;
						this.form = {};
						if (this.dialogVisibleComment == true) {
							this.getData2();
						} else if (this.remarkShow == true) {
							this.remarkClick()
						} else {
							this.getData();
						}
					}
				}).catch((error) => {
					console.log(error)
				})


			},
			// 分页导航
			handlePageChange(val) {
				this.$set(this.query, 'pogeNo', val);
				this.getData();
			},
			handlePageChange2(val) {
				this.$set(this.query2, 'pogeNo', val);
				this.getData2();
			}
		}
	};
</script>

<style scoped>
	.handle-box {
		margin-bottom: 20px;
	}

	.handle-select {
		width: 120px;
	}

	.handle-input {
		width: 200px;
		display: inline-block;
	}

	.table {
		width: 100%;
		font-size: 16px;
	}

	.red {
		color: #ff0000;
	}

	.mr10 {
		margin-right: 10px;
	}

	.table-td-thumb {
		display: block;
		margin: auto;
		width: 40px;
		height: 40px;
	}

	.el-dropdown-link {
		cursor: pointer;
		color: #409EFF;
		font-size: 14px;
	}

	.el-icon-arrow-down {
		font-size: 14px;
	}
</style>